<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<!doctype html>
<html lang="ch">

<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport"
	content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
<meta name="format-detection" content="telephone=no">
<title>订单后台管理系统</title>
<script src="js/jquery.min.js"></script>
<script src="js/bootstrap.min.js"></script>
<script>
            $(function() {
                $(".meun-item").click(function() {
                    $(".meun-item").removeClass("meun-item-active");
                    $(this).addClass("meun-item-active");
                    var itmeObj = $(".meun-item").find("img");
                    itmeObj.each(function() {
                        var items = $(this).attr("src");
                        items = items.replace("_grey.png", ".png");
                        items = items.replace(".png", "_grey.png")
                        $(this).attr("src", items);
                    });
                    var attrObj = $(this).find("img").attr("src");
                    ;
                    attrObj = attrObj.replace("_grey.png", ".png");
                    $(this).find("img").attr("src", attrObj);
                });
                $("#topAD").click(function() {
                    $("#topA").toggleClass(" glyphicon-triangle-right");
                    $("#topA").toggleClass(" glyphicon-triangle-bottom");
                });
                $("#topBD").click(function() {
                    $("#topB").toggleClass(" glyphicon-triangle-right");
                    $("#topB").toggleClass(" glyphicon-triangle-bottom");
                });
                $("#topCD").click(function() {
                    $("#topC").toggleClass(" glyphicon-triangle-right");
                    $("#topC").toggleClass(" glyphicon-triangle-bottom");
                });
                $(".toggle-btn").click(function() {
                    $("#leftMeun").toggleClass("show");
                    $("#rightContent").toggleClass("pd0px");
                })
            })
        </script>
<link href="css/bootstrap.min.css" rel="stylesheet">
<link rel="stylesheet" type="text/css" href="css/common.css" />
<link rel="stylesheet" type="text/css" href="css/slide.css" />
<link rel="stylesheet" type="text/css" href="css/bootstrap.min.css" />
<link rel="stylesheet" type="text/css" href="css/flat-ui.min.css" />
<link rel="stylesheet" type="text/css" href="css/jquery.nouislider.css">
</head>

<body>
	<div id="wrap">
		<!-- 左侧菜单栏目块 -->
		<div class="leftMeun" id="leftMeun">
			<div id="logoDiv">
				<p id="logoP">
					<img id="logo" alt="点餐后台管理系统" src="images/logo.png"><span>点餐后台管理系统</span>
				</p>
			</div>
			<div id="personInfor">
				<p id="userName" class="loginName">${sessionScope.user.username }</p>
				<p>
					<a href="login.jsp">退出登录</a>
				</p>
			</div>
			<div class="meun-title">管理</div>
			<div class="meun-item meun-item-active" href="#sour"
				aria-controls="sour" role="tab" data-toggle="tab">
				<img src="images/icon_source.png">菜单管理
			</div>
			<div class="meun-item" href="#user" aria-controls="user" role="tab"
				data-toggle="tab">
				<img src="images/icon_user_grey.png">订单管理
			</div>
			<div class="meun-item" href="#chan" aria-controls="chan" role="tab"
				data-toggle="tab">
				<img src="images/icon_change_grey.png">修改密码
			</div>
		</div>

		<!-- 右侧具体内容栏目 -->
		<div id="rightContent">
			<a class="toggle-btn" id="nimei"> <i
				class="glyphicon glyphicon-align-justify"></i>
			</a>
			<!-- Tab panes -->
			<div class="tab-content">

				<!-- 菜品管理模块 -->
				<div role="tabpanel" class="tab-pane active" id="sour">
					<div class="check-div form-inline">
						<div class="col-xs-3">
							<button class="btn btn-yellow btn-xs" data-toggle="modal"
								data-target="#addSource">添加菜品</button>
						</div>
						<form action="Mohu" method="post">
						<div class="col-xs-4">
							<input type="text" class="form-control input-sm"
								placeholder="输入文字搜索" name="p_c">
							<button type="submit" class="btn btn-white btn-xs ">查 询</button>
						</div>
						</form>
					</div>

					<div class="data-div">
						<div class="row tableHeader">
							<div class="col-xs-2 ">菜品名称</div>
							<div class="col-xs-2 ">菜系</div>
							<div class="col-xs-2">价格</div>
							<div class="col-xs-2">描述</div>
							<div class="col-xs-2">图片</div>
						</div>
						<div class="tablebody" id="caidan">
							<c:forEach items="${products }" var="p">
							<div class="row">
								<div class="col-xs-2 ">${p.product_name }</div>
								<div class="col-xs-2">${p.product_category }</div>
								<div class="col-xs-2">${p.product_price }</div>
								<div class="col-xs-2">${p.product_description }</div>
								<div class="col-xs-2"><img src="uploads/${p.product_icon}" width="100px" height="60px"></div>
								<div class="col-xs-2">
									<button class="btn btn-success btn-xs" data-toggle="modal" data-target="#updateSource" onclick="getProductVal(${p.product_id})">修改</button>
									<button id="del" class="btn btn-danger btn-xs" data-toggle="modal" data-target="#deleteGreens" onclick="delProduct(${p.product_id})">删除</button>
								</div>
							</div>
							</c:forEach>
						</div>
					</div>


					<!--页码块-->
					<footer class="footer">
						<ul class="pagination">
							<c:if test="${page1.isFirstPage ==false}"><a href="selectAllProduct?pageNum=1">首页</a> </c:if>
							<c:if test="${page1.isFirstPage ==true}">首页</c:if> 
							<c:if test="${page1.hasPreviousPage ==false}">上一页 </c:if>
							<c:if test="${page1.hasPreviousPage ==true}"><a href="selectAllProduct?pageNum=${page1.prePage}">上一页</a></c:if> 
							<c:if test="${page1.hasNextPage ==false}">下一页</c:if>
							<c:if test="${page1.hasNextPage ==true}"><a href="selectAllProduct?pageNum=${page1.nextPage}">下一页</a></c:if>
							<c:if test="${page1.isLastPage ==false}"><a href="selectAllProduct?pageNum=${page1.pages}">末页</a> </c:if>
							<c:if test="${page1.isLastPage ==true}">末页</c:if> 	
							<li class="gray">共${page1.pages }页</li>	
							
						</ul>
					</footer>
					<!--弹出窗口 添加资源-->
					<div class="modal fade" id="addSource" role="dialog"
						aria-labelledby="gridSystemModalLabel">
						<div class="modal-dialog" role="document">
							<div class="modal-content">
								<div class="modal-header">
									<button type="button" class="close" data-dismiss="modal"
										aria-label="Close">
										<span aria-hidden="true">&times;</span>
									</button>
									<h4 class="modal-title" id="gridSystemModalLabel">添加菜品</h4>
								</div>
								<div class="modal-body">
									<div class="container-fluid">
										<form class="form-horizontal" action="addProduct" method="post" enctype="multipart/form-data">
											<div class="form-group ">
												<label for="sName" class="col-xs-3 control-label"
													class="bookName">菜品名称：</label>
												<div class="col-xs-8 ">
													<input type="text" class="form-control input-sm duiqi"
														id="sName" placeholder="" name="product_name" >
												</div>
											</div>
											<div class="form-group">
												<label for="sLink" class="col-xs-3 control-label">菜系：</label>
												<div class="col-xs-8 ">
													<input type="text" class="form-control input-sm duiqi"
														id="sLink" placeholder="" name="product_category">
												</div>
											</div>
											<div class="form-group">
												<label for="sOrd" class="col-xs-3 control-label">价格：</label>
												<div class="col-xs-8">
													<input type="text" class="form-control input-sm duiqi"
														id="sOrd" placeholder="" name="product_price">
												</div>
											</div>
											<div class="form-group">
												<label for="sOrd" class="col-xs-3 control-label">描述：</label>
												<div class="col-xs-8">
													<input type="text" class="form-control input-sm duiqi" id="sOrd" placeholder="" name="product_description">
												</div>
											</div>
											<div class="form-group">
												<label for="sOrd" class="col-xs-3 control-label">图片：</label>
												<div class="col-xs-8">
													<input type="file" class="duiqi" id="sOrd" name="file"/>
												</div>
											</div>
											<div class="modal-footer">
												<button type="button" class="btn btn-xs btn-xs btn-white" data-dismiss="modal">取 消</button>
												<button type="submit" class="btn btn-xs btn-xs btn-green">保存</button>
											</div>
											</form>
									</div>
								</div>								
							
							</div>
						</div>
					</div>
					
					<!--弹出窗口 修改资源-->
					<div class="modal fade" id="updateSource" role="dialog"
						aria-labelledby="gridSystemModalLabel">
						<div class="modal-dialog" role="document">
							<div class="modal-content">
								<div class="modal-header">
									<button type="button" class="close" data-dismiss="modal"
										aria-label="Close">
										<span aria-hidden="true">&times;</span>
									</button>
									<h4 class="modal-title" id="gridSystemModalLabel">修改菜品</h4>
								</div>
								<div class="modal-body">
									<div class="container-fluid">
										<form class="form-horizontal" action="updateProduct" method="post" enctype="multipart/form-data">
											<div class="form-group ">
												<label for="sName" class="col-xs-3 control-label"
													class="bookName">菜品名称：</label>
												<div class="col-xs-8 ">
													<input type="text" class="form-control input-sm duiqi"
														id="uproduct_name" placeholder="" name="uproduct_name">
												</div>
											</div>
											<input type="hidden" value="" id="uproduct_id" name="uproduct_id"/>			
											<div class="form-group">
												<label for="sLink" class="col-xs-3 control-label">菜系：</label>
												<div class="col-xs-8 ">
													<input type="text" class="form-control input-sm duiqi"
														id="uproduct_category" placeholder="" name="uproduct_category">
												</div>
											</div>
											<div class="form-group">
												<label for="sOrd" class="col-xs-3 control-label">价格：</label>
												<div class="col-xs-8">
													<input type="text" class="form-control input-sm duiqi"
														id="uproduct_price" placeholder="" name="uproduct_price">
												</div>
											</div>
											<div class="form-group">
												<label for="sOrd" class="col-xs-3 control-label">描述：</label>
												<div class="col-xs-8">
													<input type="text" class="form-control input-sm duiqi" id="uproduct_description" placeholder="" name="uproduct_description">
												</div>
											</div>
											<div class="form-group">
												<label for="sOrd" class="col-xs-3 control-label">图片：</label>
												<div class="col-xs-8">
													<input type="file" class="duiqi" id="sOrd" name="ufile"/>
												</div>
											</div>
											<div class="modal-footer">
												<button type="button" class="btn btn-xs btn-xs btn-white" data-dismiss="modal">取 消</button>
												<button type="submit" class="btn btn-xs btn-xs btn-green">保存</button>
											</div>
											</form>
									</div>
								</div>								
							
							</div>
						</div>
					</div>
				</div>


				<!--订单管理模块-->
								<!--订单管理模块-->
				<div role="tabpanel" class="tab-pane" id="user">
					<div class="check-div form-inline">
						<div class="col-xs-3">
							<button class="btn btn-yellow btn-xs" data-toggle="modal">订单管理
							</button>
						</div>
						<form action="selectByLikebuyer_name" method="post">
							<div class="col-xs-4">
								<input type="text" class="form-control input-sm"
									placeholder="输入文字搜索" name="buyer_name">
								<button class="btn btn-white btn-xs " type="submit">查 询
								</button>
							</div>
						</form>
					</div>
					<div class="data-div" id="orderMa">
						<div class="row tableHeader">
							<div class="col-xs-2 ">订单id</div>
							<div class="col-xs-2 ">姓名</div>
							<div class="col-xs-2">送餐地址</div>
							<div class="col-xs-2">电话</div>
							<div class="col-xs-2">订单状态</div>
							<div class="col-xs-2"></div>
							<div class="col-xs-2">操作</div>
						</div>
						<c:forEach items="${lom }" var="l">
							<div class="tablebody" >

								<div class="row">
									<div class="col-xs-2 ">${l.order_id }</div>
									<div class="col-xs-2">${l.buyer_name }</div>
									<div class="col-xs-2">${l.buyer_address }</div>
									<div class="col-xs-2">${l.buyer_phone }</div>
									<div class="col-xs-2">
									<c:if test="${l.order_status==false }">新订单</c:if>
									<c:if test="${l.order_status==true }">已处理</c:if>
									</div>
									<div class="col-xs-2">
										<input type="button" value="详情" class="btn btn-danger btn-xs"
											data-toggle="modal"
											onclick="javascrtpt:window.location.href='selectOrderDetailByid?order_id=${l.order_id }'">		
										<button id="del" class="btn btn-danger btn-xs" data-toggle="modal" data-target="#deleteGreens" onclick="delOrder('${l.buyer_name}')">删除</button>             
									</div>
								</div>


							</div>
						</c:forEach>
					</div>

					<!--页码块-->
					<footer class="footer">
						<ul class="pagination">
							<%--  <p>当前总共${page.total}条记录、共${page.pages}页、每页${page.pageSize}条记录、当前是第${page.pageNum }页</p> --%>
							<c:if test="${page.isFirstPage==true }">
								<a>首页</a>
							</c:if>
							<c:if test="${page.isFirstPage==false }">
								<a href="selectAll?pageNum=${page.firstPage }">首页</a>
							</c:if>
							<c:if test="${page.hasPreviousPage==false }">
								<a>上一页</a>
							</c:if>
							<c:if test="${page.hasPreviousPage==true }">
								<a href="selectAll?pageNum=${page.prePage }">上一页</a>
							</c:if>
							<h>当前是第${page.pageNum }页</h>
							<c:if test="${page.hasNextPage==false }">
								<a>下一页</a>
							</c:if>
							<c:if test="${page.hasNextPage==true }">
								<a href="selectAll?pageNum=${page.nextPage }">下一页</a>
							</c:if>
							<c:if test="${page.isLastPage==true }">
								<a>末页</a>
							</c:if>
							<c:if test="${page.isLastPage==false }">
								<a href="selectAll?pageNum=${page.lastPage }">末页</a>
							</c:if>
							<li><i class="glyphicon glyphicon-menu-left"> </i></li>
							<li><i class="glyphicon glyphicon-menu-right"> </i></li>
						</ul>
					</footer>

					<!--弹出删除用户警告窗口-->
					<div class="modal fade" id="deleteUser" role="dialog"
						aria-labelledby="gridSystemModalLabel">
						<div class="modal-dialog" role="document">

							<div class="modal-content">
								<div class="modal-header">
									<button type="button" class="close" data-dismiss="modal"
										aria-label="Close">
										<span aria-hidden="true">&times;</span>
									</button>
									<h4 class="modal-title" id="gridSystemModalLabel">提示</h4>
								</div>
								<div class="modal-body">
									<div class="container-fluid">确定要删除该订单？删除后不可恢复！</div>
								</div>

								<div class="modal-footer">
									<button type="button" class="btn btn-xs btn-white"
										data-dismiss="modal">取 消</button>
									<button type="button" class="btn  btn-xs btn-danger"
										href="deleteOrderMaster?order_id=${l.order_id}">保 存</button>
								</div>

							</div>

						</div>
					</div>
				</div>



				<!-- 修改密码模块 -->
				<div role="tabpanel" class="tab-pane" id="chan">
					<div
						style="padding: 50px 0; margin-top: 50px; background-color: #fff; text-align: right; width: 420px; margin: 50px auto;">
						<form class="form-horizontal">
							<input type="hidden" id="userName1" name="userName1" value="${sessionScope.user }">
							<div class="form-group">
								<label for="sKnot" class="col-xs-4 control-label">原密码：</label>
								<div class="col-xs-5">
									<input type="password" class="form-control input-sm duiqi" id="opwd"
										placeholder="" style="margin-top: 7px;" name="opwd">
								</div>
							</div>
							<div class="form-group">
								<label for="sKnot" class="col-xs-4 control-label">新密码：</label>
								<div class="col-xs-5">
									<input type="password" class="form-control input-sm duiqi" id="npwd"
										placeholder="" style="margin-top: 7px;" name="npwd">
								</div>
							</div>
							<div class="form-group">
								<label for="sKnot" class="col-xs-4 control-label">重复密码：</label>
								<div class="col-xs-5">
									<input type="password" class="form-control input-sm duiqi" id="ypwd"
										placeholder="" style="margin-top: 7px;" name="ypwd">
								</div>
							</div>
							<div class="form-group text-right">
								<div class="col-xs-offset-4 col-xs-5"
									style="margin-left: 169px;">
									<button type="reset" class="btn btn-xs btn-white">取 消</button>
									<button type="button" class="btn btn-xs btn-green" onclick="upPwd()">保存</button>
								</div>
							</div>
						</form>
					</div>

				</div>
			</div>
		</div>
	</div>

	<script src="js/jquery.nouislider.js"></script>


	<script>
	
	function upPwd(){
		$.ajax({        	
            url: "user/upPwd",//要请求的服务器url
            data: {
            	userName: $("#userName1").val(),
            	opwd: $("#opwd").val(),
            	ypwd: $("#ypwd").val(),
            },
            async: true,   //是否为异步请求
            cache: false,  //是否缓存结果
            type: "POST", //请求方式为POST
            dataType: "text",   //服务器返回的数据是什么类型 
            success: function(result){
            	if(result == "0"){
            		alert("修改成功");
            	}else{
            		alert("修改失败");
            	}
            }
          });		
	}
	
	function getProductVal(upid){
		$.ajax({        	
            url: "findProductById",//要请求的服务器url
            data: {
            	uproduct_id: upid,
            },
            async: true,   //是否为异步请求
            cache: false,  //是否缓存结果
            type: "POST", //请求方式为POST
            dataType: "JSON",   //服务器返回的数据是什么类型 
            success: function(result){
            	$("#uproduct_id").val(result.product_id);
            	$("#uproduct_name").val(result.product_name);
            	$("#uproduct_category").val(result.product_category);
            	$("#uproduct_description").val(result.product_description);
            	$("#uproduct_price").val(result.product_price);
            }
          });		
	}
	
	function delProduct(did){
		
		$.ajax({        	
            url: "deleteProduct",//要请求的服务器url
            data: {
            	dproduct_id: did,
            },
            async: true,   //是否为异步请求
            cache: false,  //是否缓存结果
            type: "POST", //请求方式为POST
            dataType: "text",   //服务器返回的数据是什么类型 
            success: function(result){
            	if(result == "0"){
            		$("#caidan").load(location.href+" #caidan");
            		alert("删除成功！");
            	}else{
            		alert("删除失败");
            	}          	
            }
          });		 
	}
	
function delOrder(dname){
		
		$.ajax({        	
            url: "deleteOrderMaster",//要请求的服务器url
            data: {
            	buyer_name: dname,
            },
            async: true,   //是否为异步请求
            cache: false,  //是否缓存结果
            type: "POST", //请求方式为POST
            dataType: "text",   //服务器返回的数据是什么类型 
            success: function(result){
            	if(result == "success"){
            		$("#orderMa").load(location.href+" #orderMa");
            		alert("删除成功！");
            	}else{
            		alert("删除失败");
            	}          	
            }
          });		 
	}
	
	function huadong(my, unit, def, max) {
		$(my).noUiSlider({
			range: [0, max],
			start: [def],
			handles: 1,
			connect: 'upper',
			slide: function() {
				var val = Math.floor($(this).val());
				$(this).find(".noUi-handle").text(
						val + unit
						);
				console.log($(this).find(".noUi-handle").parent().parent().html());
			},
			set: function() {
				var val = Math.floor($(this).val());
				$(this).find(".noUi-handle").text(
						val + unit
						);
			}
		});
		$(my).val(def, true);
	}
	huadong('.slider-minmax1', "分钟", "5", 30);
	huadong('.slider-minmax2', "分钟", "6", 15);
	huadong('.slider-minmax3', "分钟", "10", 60);
	huadong('.slider-minmax4', "次", "2", 10);
	huadong('.slider-minmax5', "天", "3", 7);
	huadong('.slider-minmax6', "天", "8", 10);
</script>
</body>

</html>